<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>sticky定位</title>
</head>

<body>
    <!--做一个文档流-->
    <div class="content">

        <h2>梦游天姥吟留别</h2>
        <br />李白 〔唐代〕
        <br />
        <br />海客谈瀛洲，烟涛微茫信难求；
        <br />越人语天姥，云霞明灭或可睹。
        <br />天姥连天向天横，势拔五岳掩赤城。
        <br />天台四万八千丈，对此欲倒东南倾。(四万 一作：一万)
        <br />
        <br />我欲因之梦吴越，一夜飞度镜湖月。
        <br />湖月照我影，送我至剡溪。
        <br />谢公宿处今尚在，渌水荡漾清猿啼。
        <br />脚著谢公屐，身登青云梯。
        <br />半壁见海日，空中闻天鸡。
        <br />千岩万转路不定，迷花倚石忽已暝。
        <br />熊咆龙吟殷岩泉，栗深林兮惊层巅。
        <br />云青青兮欲雨，水澹澹兮生烟。
        <br />列缺霹雳，丘峦崩摧。
        <br />洞天石扉，訇然中开。
        <br />青冥浩荡不见底，日月照耀金银台。
        <br />霓为衣兮风为马，云之君兮纷纷而来下。
        <br />虎鼓瑟兮鸾回车，仙之人兮列如麻。
        <br />忽魂悸以魄动，恍惊起而长嗟。
        <br />惟觉时之枕席，失向来之烟霞。
        <br />
        <br />世间行乐亦如此，古来万事东流水。
        <br />别君去兮何时还？且放白鹿青崖间，须行即骑访名山。
        <br />安能摧眉折腰事权贵，使我不得开心颜！
        <hr />
        <h1>蜀道难</h1>
        <br />
        <br />李白 〔唐代〕
        <br />
        <br />噫吁嚱，危乎高哉！
        <br />蜀道之难，难于上青天！
        <br />蚕丛及鱼凫，开国何茫然！
        <br />尔来四万八千岁，不与秦塞通人烟。
        <br />西当太白有鸟道，可以横绝峨眉巅。
        <br />地崩山摧壮士死，然后天梯石栈相钩连。
        <br />上有六龙回日之高标，下有冲波逆折之回川。
        <br />黄鹤之飞尚不得过，猿猱欲度愁攀援。
        <br />青泥何盘盘，百步九折萦岩峦。
        <br />扪参历井仰胁息，以手抚膺坐长叹。
        <br />问君西游何时还？畏途巉岩不可攀。
        <br />但见悲鸟号古木，雄飞雌从绕林间。
        <br />又闻子规啼夜月，愁空山。
        <br />蜀道之难，难于上青天，使人听此凋朱颜！
        <br />连峰去天不盈尺，枯松倒挂倚绝壁。
        <br />飞湍瀑流争喧豗，砯崖转石万壑雷。
        <br />其险也如此，嗟尔远道之人胡为乎来哉！(也如此 一作：也若此)
        <br />剑阁峥嵘而崔嵬，一夫当关，万夫莫开。
        <br />所守或匪亲，化为狼与豺。
        <br />朝避猛虎，夕避长蛇，磨牙吮血，杀人如麻。
        <br />锦城虽云乐，不如早还家。
        <br />蜀道之难，难于上青天，侧身西望长咨嗟！
        <hr />
        <div class="ad">
            <div class="ad-content">我是简简单单的广告</div>
        </div>
        <h2>梦游天姥吟留别</h2>
        <br />李白 〔唐代〕
        <br />
        <br />海客谈瀛洲，烟涛微茫信难求；
        <br />越人语天姥，云霞明灭或可睹。
        <br />天姥连天向天横，势拔五岳掩赤城。
        <br />天台四万八千丈，对此欲倒东南倾。(四万 一作：一万)
        <br />
        <br />我欲因之梦吴越，一夜飞度镜湖月。
        <br />湖月照我影，送我至剡溪。
        <br />谢公宿处今尚在，渌水荡漾清猿啼。
        <br />脚著谢公屐，身登青云梯。
        <br />半壁见海日，空中闻天鸡。
        <br />千岩万转路不定，迷花倚石忽已暝。
        <br />熊咆龙吟殷岩泉，栗深林兮惊层巅。
        <br />云青青兮欲雨，水澹澹兮生烟。
        <br />列缺霹雳，丘峦崩摧。
        <br />洞天石扉，訇然中开。
        <br />青冥浩荡不见底，日月照耀金银台。
        <br />霓为衣兮风为马，云之君兮纷纷而来下。
        <br />虎鼓瑟兮鸾回车，仙之人兮列如麻。
        <br />忽魂悸以魄动，恍惊起而长嗟。
        <br />惟觉时之枕席，失向来之烟霞。
        <br />
        <br />世间行乐亦如此，古来万事东流水。
        <br />别君去兮何时还？且放白鹿青崖间，须行即骑访名山。
        <br />安能摧眉折腰事权贵，使我不得开心颜！
        <hr />
        <h1>蜀道难</h1>
        <br />
        <br />李白 〔唐代〕
        <br />
        <br />噫吁嚱，危乎高哉！
        <br />蜀道之难，难于上青天！
        <br />蚕丛及鱼凫，开国何茫然！
        <br />尔来四万八千岁，不与秦塞通人烟。
        <br />西当太白有鸟道，可以横绝峨眉巅。
        <br />地崩山摧壮士死，然后天梯石栈相钩连。
        <br />上有六龙回日之高标，下有冲波逆折之回川。
        <br />黄鹤之飞尚不得过，猿猱欲度愁攀援。
        <br />青泥何盘盘，百步九折萦岩峦。
        <br />扪参历井仰胁息，以手抚膺坐长叹。
        <br />问君西游何时还？畏途巉岩不可攀。
        <br />但见悲鸟号古木，雄飞雌从绕林间。
        <br />又闻子规啼夜月，愁空山。
        <br />蜀道之难，难于上青天，使人听此凋朱颜！
        <br />连峰去天不盈尺，枯松倒挂倚绝壁。
        <br />飞湍瀑流争喧豗，砯崖转石万壑雷。
        <br />其险也如此，嗟尔远道之人胡为乎来哉！(也如此 一作：也若此)
        <br />剑阁峥嵘而崔嵬，一夫当关，万夫莫开。
        <br />所守或匪亲，化为狼与豺。
        <br />朝避猛虎，夕避长蛇，磨牙吮血，杀人如麻。
        <br />锦城虽云乐，不如早还家。
        <br />蜀道之难，难于上青天，侧身西望长咨嗟！
        <hr />
    </div>
    <style>
        .content {
            max-width: 300px;
            margin: 0 auto;
        }

        .ad {
            background-color: yellow;
            width: 100%;
            height: 50px;

            position: sticky;
            top: 50px;
        }
    </style>

</body>

</html>